// AxiomProgress 组件样式
.axiom-progress {
  display: flex;
  flex-direction: column;
  gap: var(--axiom-progress-gap);
  
  // 标签样式
  &__label {
    font-size: var(--axiom-progress-label-font-size);
    font-weight: var(--axiom-progress-label-weight);
    color: var(--axiom-progress-label-color);
    font-family: var(--font-family-base);
    line-height: 1.4;
  }
  
  // 线性进度条
  &--line {
    .axiom-progress__line {
      display: flex;
      align-items: center;
      gap: var(--axiom-progress-line-gap);
      width: 100%;
    }
    
    .axiom-progress__track {
      flex: 1;
      background-color: var(--axiom-progress-track-bg);
      border-radius: var(--axiom-progress-track-radius);
      overflow: hidden;
      position: relative;
    }
    
    .axiom-progress__bar {
      height: 100%;
      border-radius: inherit;
      position: relative;
      overflow: hidden;
      transition: width 0.3s ease;
      
      // 条纹样式
      .axiom-progress__stripes {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: var(--axiom-progress-stripes-bg);
        background-size: var(--axiom-progress-stripes-size) var(--axiom-progress-stripes-size);
        animation: progress-stripes 1s linear infinite;
      }
    }
    
    .axiom-progress__text {
      font-size: var(--axiom-progress-text-font-size);
      color: var(--axiom-progress-text-color);
      font-family: var(--font-family-base);
      font-weight: var(--axiom-progress-text-weight);
      white-space: nowrap;
    }
    
    .axiom-progress__text-inside {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: var(--axiom-progress-text-inside-font-size);
      color: var(--axiom-progress-text-inside-color);
      font-family: var(--font-family-base);
      font-weight: var(--axiom-progress-text-inside-weight);
      white-space: nowrap;
      text-shadow: var(--axiom-progress-text-inside-shadow);
    }
  }
  
  // 圆形进度条
  &--circle {
    display: flex;
    align-items: center;
    justify-content: center;
    
    .axiom-progress__circle {
      position: relative;
      display: inline-block;
    }
    
    .axiom-progress__svg {
      transform: rotate(-90deg);
    }
    
    .axiom-progress__circle-track {
      stroke: var(--axiom-progress-track-bg);
    }
    
    .axiom-progress__circle-bar {
      transition: stroke-dashoffset 0.3s ease;
    }
    
    .axiom-progress__circle-content {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
    }
    
    .axiom-progress__circle-text {
      font-size: var(--axiom-progress-circle-text-font-size);
      color: var(--axiom-progress-circle-text-color);
      font-family: var(--font-family-base);
      font-weight: var(--axiom-progress-circle-text-weight);
      line-height: 1;
    }
  }
  
  // 仪表盘进度条
  &--dashboard {
    display: flex;
    align-items: center;
    justify-content: center;
    
    .axiom-progress__dashboard {
      position: relative;
      display: inline-block;
    }
    
    .axiom-progress__svg {
      transform: rotate(135deg);
    }
    
    .axiom-progress__dashboard-track {
      stroke: var(--axiom-progress-track-bg);
    }
    
    .axiom-progress__dashboard-bar {
      transition: stroke-dashoffset 0.3s ease;
    }
    
    .axiom-progress__dashboard-content {
      position: absolute;
      top: 60%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center;
    }
    
    .axiom-progress__dashboard-text {
      font-size: var(--axiom-progress-circle-text-font-size);
      color: var(--axiom-progress-circle-text-color);
      font-family: var(--font-family-base);
      font-weight: var(--axiom-progress-circle-text-weight);
      line-height: 1;
    }
  }

  // 状态颜色变体
  &--primary {
    .axiom-progress__bar { background-color: var(--primary-color); }
    .axiom-progress__circle-bar, .axiom-progress__dashboard-bar { stroke: var(--primary-color); }
  }
  &--success {
    .axiom-progress__bar { background-color: var(--success-color); }
    .axiom-progress__circle-bar, .axiom-progress__dashboard-bar { stroke: var(--success-color); }
  }
  &--warning {
    .axiom-progress__bar { background-color: var(--warning-color); }
    .axiom-progress__circle-bar, .axiom-progress__dashboard-bar { stroke: var(--warning-color); }
  }
  &--danger {
    .axiom-progress__bar { background-color: var(--danger-color); }
    .axiom-progress__circle-bar, .axiom-progress__dashboard-bar { stroke: var(--danger-color); }
  }

  // 尺寸变体
  // 小尺寸
  &--small {
    .axiom-progress__track {
      height: var(--axiom-progress-sm-track-height);
    }
    
    .axiom-progress__text,
    .axiom-progress__circle-text,
    .axiom-progress__dashboard-text {
      font-size: var(--axiom-progress-sm-text-font-size);
    }
    
    .axiom-progress__text-inside {
      font-size: var(--axiom-progress-sm-text-inside-font-size);
    }
  }
  
  // 大尺寸
  &--large {
    .axiom-progress__track {
      height: var(--axiom-progress-lg-track-height);
    }
    
    .axiom-progress__text,
    .axiom-progress__circle-text,
    .axiom-progress__dashboard-text {
      font-size: var(--axiom-progress-lg-text-font-size);
    }
    
    .axiom-progress__text-inside {
      font-size: var(--axiom-progress-lg-text-inside-font-size);
    }
  }
}

// 条纹动画
@keyframes progress-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: var(--axiom-progress-stripes-size) 0;
  }
}